<template>
	<div class="zhengtuojianhuo">
		<van-nav-bar :fixed="true" class="navBar" title="移位上架" left-arrow @click-left="$router.go(-1)"></van-nav-bar>




		<div class="goodsFromWarp">

				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName" style="width:95px;">商品编码：</div>
						</div>
						<van-field
							 class="skuInput"
							 v-model="editForm.itemid"
							 placeholder="请填写商品编码"
							 clearable
							 @keyup="onEnter($event,do_inputspbar)"
						 />

						 <div class="searchBtn">
								<button :disabled="isdisabled"  @click.stop="lingquBtn()" >
									<van-icon name="ellipsis" color="#1989fa"  />
								</button>
						 </div>
				</div>

				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName" style="width:95px;" >移自仓位：</div>
						</div>

						<van-field
							 class="skuInput"
							 v-model="skuRow.cwno"
							 placeholder="请填写移自仓位"
							 clearable
							 @keyup="onEnter($event,do_inputspbarCwno)"
						 />

						 <div class="searchBtn">
								<button :disabled="isdisabled"  @click.stop="_getSelectSku()" >
									<van-icon name="ellipsis" color="#1989fa"  />
								</button>
						 </div>
				</div>


				<div class="zhuyi">
						 {{skuRow.subsname}} {{skuRow.subsname>''?'-':''}} {{skuRow.username}}
				</div>
				<!-- <div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">商品：</div>
						</div>
						<div class="skuNoInput">
							{{skuRow.itemid}} {{skuRow.itemid>''?'-':''}}{{skuRow.subsname}}
						</div>
				</div> -->


				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">仓库：</div>
						</div>
						<div class="skuNoInput">
							{{goodsRow.whsid}} {{goodsRow.whsid>''?'-':''}}  {{goodsRow.whstype}} {{goodsRow.whsid>''?'-':''}} {{goodsRow.whsname}}
						</div>
				</div>





				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">总库存：</div>
						</div>
						<div class="skuNoInput">
							{{goodsRow.totqty}}
						</div>
				</div>


				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">箱装：</div>
						</div>
						<div class="skuNoInput">
							{{goodsRow.unit}}
						</div>
				</div>


				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">箱数：</div>
						</div>
						<van-field
							 class="skuInput"
							 v-model="goodsRow.pack"
							 placeholder="请填写箱数"
							 clearable
						 />
				</div>




				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">散数：</div>
						</div>

						<van-field
							 class="skuInput"
							 v-model="goodsRow.qty"
							 placeholder="请填写箱数"
							 clearable
						 />
				</div>


				<div class="goodsInputWarp">
						<div class="goodsInputLabel" >
							<div class="goodsInputBorder"></div>
							<div class="skuName"  style="width:95px;">移至仓位：</div>
						</div>

						<van-field
							 class="skuInput"
							 v-model="editForm.cwnot"
							 placeholder="请填写移至仓位"
							 clearable
						 />

						 <div class="searchBtn">
								<button :disabled="isdisabled"  @click.stop="searchCwnoBtn()" >
									<van-icon name="ellipsis" color="#1989fa"  />
								</button>
						 </div>
				</div>

		</div>


		<div class="skuBtn">
			<!-- <van-button type="info" :disabled="isdisabled" @click="lingquBtn()">领取任务</van-button> -->
			<van-button type="info" :disabled="isdisabled" @click="saveShangJiaBtn()">上架确认</van-button>
		</div>



		<div class="carCardWarp">
				<div class="carCard" v-for="(item,index) in cangweiSkuData" :key="index">
					<div class="goodsTitleRow">
							<div class="goodsTitleLabel">
								<div class="skuName">商品：</div>
							</div>
							<div class="skuNoTitle">
							{{item.itemid}}
							</div>
					</div>

					<van-row class="goodRow" style="margin-top: 10px;">
					  <van-col span="12"> <span>包装:</span>{{item.unit}}</van-col>
					  <van-col span="12"> <span>箱:</span>{{item.pack}}</van-col>
					</van-row>

					<van-row class="goodRow" style="margin-top: 10px;">
					  <van-col span="12"> <span>散:</span>{{item.qty}}</van-col>
					  <van-col span="12"> <span>总:</span>{{item.totqty}}</van-col>
					</van-row>

				</div>
		</div>

		<van-overlay :show="isSkuVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="商品列表" left-arrow @click-left="isSkuVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in lingquData" :key="i" class="danjuRow" @click="selectSkuClick(row,i)" >
								<van-row class="skuList" >
								  <van-col span="24"> <span>单号：</span> {{row.bill}}</van-col>
								</van-row>


								<div class="skuNamaRow">
									<div class="skuNamaRow_left">商品名称：</div>
									<div class="skuNamaRow_right">{{row.itemid}} {{row.subsname}}</div>
								</div>

								<van-row class="skuList">
									<van-col span="24"> <span style="width:120px;">初次上架位：</span>{{row.mb_cwno}}</van-col>
								</van-row>

								<van-row class="skuList">
									<van-col span="24"> <span>上架时间：</span>{{row.sj_date}}</van-col>
								</van-row>

								<van-row class="skuList">
									<van-col span="12"> <span>箱数：</span>{{row.pack}}</van-col>
									<van-col span="12"> <span>箱装：</span>{{row.unit}}</van-col>
								</van-row>

								<van-row class="skuList">
									<van-col span="12"> <span>散数：</span>{{row.qty}}</van-col>
								</van-row>
							</div>
					</div>
			</div>
		</van-overlay>

		<!-- 仓位列表 -->
		<van-overlay :show="isCwnoVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="商品列表" left-arrow @click-left="isCwnoVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in cangWeiData" :key="i" class="danjuRow" @click="selectCwnoClick(row,i)" >

								<div class="skuNamaRow">
									<div class="skuNamaRow_left">仓位：</div>
									<div class="skuNamaRow_right">{{row.cwnot}}</div>
								</div>

								<van-row class="skuList">
									<van-col span="24"> <span>箱装：</span>{{row.unit}}</van-col>
								</van-row>

								<van-row class="skuList">
									<van-col span="24"> <span>总库存：</span>{{row.totqty}}</van-col>
								</van-row>

								<van-row class="skuList">
									<van-col span="12"> <span>已分配：</span>{{row.yfpqty}}</van-col>
								</van-row>
							</div>
					</div>
			</div>
		</van-overlay>


		<van-overlay :show="isMessageVisible" :lock-scroll="false">
			<div class="messageWarp">
					<div class="messageCon">
							<div class="messageTitle">请确认</div>

							<div class="messageHeader">
									<div class="messageLabel">库区：</div>
									<div class="messageValue">{{ryuser.kqid}}</div>
							</div>



							<div class="messageHeader">
									<div class="messageLabel">从仓位：</div>
									<div class="messageValue">{{skuRow.cwno}} </div>
							</div>

							<div class="messageHeader">
									移动商品库存
							</div>

							<div class="messageHeader">
									{{skuRow.subsname}}
							</div>

							<div class="messageHeader">
									 箱装：{{goodsRow.unit}}  箱数：{{goodsRow.pack}} 散数：{{goodsRow.qty}}
							</div>

							<div class="messageHeader">
								 是否继续？
							</div>



							<div class="messageFooter">
								<div @click="saveCwnoBtn()">是</div>
								<div @click="isMessageVisible = false">否</div>
							</div>

					</div>
			</div>
		</van-overlay>
	</div>
</template>

<script>

export default {
  name: 'yiweishangjia',
  data() {
    return {
			editForm:{
				itemid:'',
				cwnot:'',
			},
			skuRow:{
				bill: "",
				cwno: "",
				itemid: "",
				mb_cwno: "",
				pack: "",
				qty: "",
				rownum: "",
				shr: "",
				sj_date: "",
				sjr: "",
				subid: "",
				subsname: "",
				unit: "",
			},
			goodsRow:{
				pack: "",
				qty: "",
				totqty: "",
				unit: "",
				whsid: "",
				whsname: "",
				whstype: "",
			},
			isdisabled:false,
			lingquData:[
				{
					bill:'111111',
				}
			],
			isSkuVisible:false,
			tableData:[],
			isCwnoVisible:false,
			cangWeiData:[
				{
					cwnot:'',
				}
			],
			cangweiSkuData:[],
			isMessageVisible:false,
		};
  },
	computed: {
		 ryuser: function(){
			 return this.GWO(true).gUSER;
		 },
	},
  methods: {
		do_inputspbar(pmtxt){
			console.log(pmtxt)  //扫描枪获取的参数
			this.editForm.itemid = pmtxt
			this._getSMsku()
		},
		_getSMsku(){
			var _self = this;
			_self.total = 0
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_y_pandian',
				'i':this.FNULLE([
				'opmode','Y_YWSJ_qrybill',
				'czyid',this.ryuser.operatorid,
				'kqid', this.ryuser.kqid,
				'itemid',this.editForm.itemid,
				])
				},'移位上架查询',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到移位上架查询查询")
					console.log(rtn_json_obj)
					_self.lingquData = rtn_json_obj
					if(_self.lingquData[0].spcwlx >''){
						_self.skuRow = _self.lingquData[0]
						console.log("2222222")
						console.log(_self.skuRow.cwno)
						if(_self.skuRow.cwno >''){
								_self._getSelectSku();
						}
					}else{
						_self.isSkuVisible = true
					}
					// if(_self.lingquData.length == 0){
					// 	_self.$toast.fail('暂无商品信息')
					// }else if(_self.lingquData.length == 1){
					// 	_self.skuRow = _self.lingquData[0]
					// 	_self._getSelectSku();
					// }else{
					// 	_self.isSkuVisible = true
					// }
				}
			});
		},
		do_inputspbarCwno(pmtxt){
			console.log(pmtxt)  //扫描枪获取的参数
			this.skuRow.cwno = pmtxt
			this._getSelectSku()
		},
		lingquBtn(){
			var _self = this;
			_self.total = 0
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_y_pandian',
				'i':this.FNULLE([
				'opmode','Y_YWSJ_qrybill',
				'czyid',this.ryuser.operatorid,
				'kqid', this.ryuser.kqid,
				'itemid',this.editForm.itemid,
				])
				},'移位上架查询',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到移位上架查询查询")
					console.log(rtn_json_obj)
					_self.lingquData = rtn_json_obj
					if(_self.lingquData.length == 0){
						_self.$toast.fail('暂无商品信息')
					}else if(_self.lingquData.length == 1){
						_self.skuRow = _self.lingquData[0]
						_self.editForm.itemid = _self.skuRow.itemid
						console.log("2222222")
						console.log(_self.skuRow.cwno)
						if(_self.skuRow.cwno >''){
								_self._getSelectSku();
						}
					}else{
						_self.isSkuVisible = true
					}
				}
			});
		},
		selectSkuClick(row){
			console.log(row)
			this.skuRow = row
			this.isSkuVisible = false
			console.log(this.skuRow.itemid)
			console.log(this.skuRow.cwno)
			console.log(this.skuRow.subid)
			this.editForm.itemid = this.skuRow.itemid
			this._getSelectSku();
		},
		_getSelectSku(){
			var _self = this;
			_self.total = 0
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_y_pandian',
					'i':this.FNULLE([
					'opmode','Y_YWSJ_qrycwnof',
					'czyid',this.ryuser.operatorid,
					'kqid', this.ryuser.kqid,
					'itemid',this.skuRow.itemid,
					'cwno',this.skuRow.cwno,
					'subid',this.skuRow.subid,
				])
				},'商品库存详情',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到商品库存详情查询")
					console.log(rtn_json_obj)
					_self.goodsRow = rtn_json_obj[0]
				}
			});
		},
		searchCwnoBtn(){
			var _self = this;
			_self.total = 0
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_y_pandian',
					'i':this.FNULLE([
					'opmode','Y_YWSJ_qrycwnot',
					'czyid',this.ryuser.operatorid,
					'kqid', this.ryuser.kqid,
					'itemid',this.skuRow.itemid,
					'subid',this.skuRow.subid,
					'cwno',this.skuRow.cwno,
				])
				},'仓位详情',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到仓位详情查询")
					console.log(rtn_json_obj)
					_self.cangWeiData = rtn_json_obj
					if(_self.cangWeiData.length > 0){
						_self.isCwnoVisible = true
					}else{
						_self.$toast.fail('暂未查询到仓位，请直接输入')
					}

				}
			});
		},
		selectCwnoClick(row){
			this.editForm.cwnot = row.cwnot
			this.isCwnoVisible  = false
			this.cangwWeiSkuBtn()
		},
		cangwWeiSkuBtn(){
			var _self = this;
			_self.total = 0
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			console.log("传过去的仓位"+ this.editForm.cwnot)
			this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_y_pandian',
					'i':this.FNULLE([
					'opmode','Y_YWSJ_qryitemid',
					'czyid',this.ryuser.operatorid,
					'kqid', this.ryuser.kqid,
					'cwnot',this.editForm.cwnot,
				])
				},'仓位商品详情',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到仓位商品详情")
					console.log(rtn_json_obj)
					_self.cangweiSkuData = rtn_json_obj
				}
			});
		},
		saveShangJiaBtn(){
			if(this.skuRow.itemid >'' && this.editForm.cwnot>''){
				this.isMessageVisible = true
			}
		},
		saveCwnoBtn(){
			let totqty = parseInt(this.goodsRow.unit) *  parseInt(this.goodsRow.pack) + parseInt(this.goodsRow.qty)
			console.log(totqty)
			var _self = this;
			_self.total = 0
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_y_pandian',
					'i':this.FNULLE([
					'opmode','Y_YWSJ_sjqr',
					'czyid',this.ryuser.operatorid,
					'kqid', this.ryuser.kqid,
					'itemid',this.skuRow.itemid,
					'subid',this.skuRow.subid,
					'cwno',this.skuRow.cwno,
					'unit',this.goodsRow.unit,
					'totqty',totqty,
					'cwnot',this.editForm.cwnot,
				])
				},'仓位上架保存',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					console.log("得到仓位上架保存详情")
					console.log(rtn_json_obj)
					if(rtn_json_obj[0].ret_ret == '-1'){
						_self.$toast.fail(rtn_json_obj[0].ret_mess)
						return
					}else{
						_self.$toast.fail(rtn_json_obj[0].ret_mess)
						_self.isMessageVisible = false
						_self.editForm = {
							itemid:'',
							cwnot:'',
						}
						_self.skuRow = {
								bill: "",
								cwno: "",
								itemid: "",
								mb_cwno: "",
								pack: "",
								qty: "",
								rownum: "",
								shr: "",
								sj_date: "",
								sjr: "",
								subid: "",
								subsname: "",
								unit: "",
						}

						_self.goodsRow = {
								pack: "",
								qty: "",
								totqty: "",
								unit: "",
								whsid: "",
								whsname: "",
								whstype: "",
						}
						_self.cangweiSkuData = []
					}
				}
			});
		},
  },
  mounted() {

  },
	components: {

	},
};
</script>

<style lang="scss" scoped>
	// 引入公共样式
	@import '@/assets/css/base.scss';
	@import '@/assets/css/input.scss';
	div.zhengtuojianhuo{
		padding-top: 50px;
	}



	div.carCardWarp{
		width: 94%;
		margin-left: 3%;
		margin-right: 3%;
		margin-top: 20px;
		font-size:20px;
		font-weight: bold;
		div.carCard{
			position: relative;
			border-left: 5px solid #4998FF;
			box-sizing: border-box;
			padding-left: 10px;
			padding-right: 10px;
			border-radius:5px;
			background-color: #fff;
			padding-top: 10px;
			padding-bottom: 10px;
			margin-bottom:15px;
			div.status{
				position: absolute;
				right: 0;
				top: 0;
				width: 65px;
				height: 30px;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #fff;
				font-size: 12px;
				border-radius: 0px 10px 0px 10px;
			}
			div.goodRow{
				margin-bottom:8px;
				span{
					display: inline-block;
					width:80px;
				}
			}
			div.goodsTitleRow{
				display: flex;
				width: 100%;
				div.goodsTitleLabel{
					width: 80px;
				}
				div.skuNoTitle{
					width: calc(100% - 80px);
				}
			}
		}
	}


	div.skuNamaRow{
		display: flex;
		line-height: 20px;
		margin-bottom: 10px;
		div.skuNamaRow_left{
			width:100px;
		}
	}


	div.messageWarp{
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 20px;
		font-weight: bold;
		div.messageCon{
			width:80%;
			height:320px;
			background-color: #fff;
			border-radius: 10px;
			position: relative;
			.messageTitle{
				width: 100%;
				background-color: #1989fa;
				height: 38px;
				color: #fff;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 13px;
				border-top-right-radius: 10px;
				border-top-left-radius: 10px;
			}
			.messageHeader{
				display: flex;
				// height: 30px;
				box-sizing: border-box;
				padding:5px 5%;
				font-size: 14px;
				width: 100%;
				div.messageLabel{
					width: 80px;
				}
				div.messageValue{
					width: calc(100% - 80px);
					white-space: normal
				}
			}
			div.messageFooter{
				display: flex;
				width: 100%;
				height: 41px;
				position: absolute;
				left: 0;
				bottom: 0;
				// background-color: #1989fa;
				div{
					width: 50%;
					height: 100%;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 12px;
				}
				div:nth-child(1){
					color: #1989fa;
				}

				div:nth-child(2){
					color: #1989fa;
				}
			}
		}
	}


	div.zhuyi{
		font-weight: bold;
		font-size: 20px;
		margin-bottom: 10px;
		line-height:23px;
	}

</style>
